8. 매개변수 객체 만들기

• 데이터 뭉치를 데이터 구조로 묶기
• 이 데이터 구조가 문제 영역을 간결하게 나타내는 추상 영역으로 간주되어 코드의 개념적인 그림을 다시 설계할 수 있음

절차

1. 데이터 구조 생성
   
2. 클래스 선호 (값 객체)
   
3. 테스트
   
4. 함수 선언 바꾸기로 새 데이터 구조를 인자로 추가
   
5. 테스트
   
6. 함수 호출하는 곳에서 새 데이터 구조를 인자로 넘기도록 수정
   
7. 기존 매개변수 제거

예시 코드

😞 Before

const station = {
    name: 'ZB1',
    readings: [
        {temp: 47, time: "2016-11-10 09:10"},
        {temp: 53, time: "2016-11-10 09:20"},
        {temp: 58, time: "2016-11-10 09:30"},
        {temp: 53, time: "2016-11-10 09:40"},
        {temp: 51, time: "2016-11-10 09:50"}
    ]
}

const operationPlan = {
    temperatureFloor: 50,
    temperatureCeiling: 55
}

const readingsOutsideRange = (station, min, max) => {
    return station.readings.filter(r => r.temp < min || r.temp > max)
}

const alerts = readingsOutsideRange(station, operationPlan.temperatureFloor, operationPlan.temperatureCeiling)

😃 After

(1) 데이터 구조 추가

class NumberRange {
    constructor(min, max) {
        this._data = {min, max}
    }

    get min() {return this._data.min}
    get max() {return this._data.max}
}

(2) (1)에서만든 데이터 구조를 매개변수로 추가

const readingsOutsideRange = (station, min, max, range = {}) => {
    return station.readings.filter(r => r.temp < min || r.temp > max)
}

(3) 새 데이터 구조 인스턴스를 매개변수로 전달

const range = new NumberRange(50, 55)

const alerts = readingsOutsideRange(station, operationPlan.temperatureFloor, range)

(4) 새 매개변수 사용

const readingsOutsideRange = (station, range) => {
    return station.readings.filter(r => r.temp < range.min || r.temp > range.max)
}

(5) NumberRange 클래스에 readingsOutsideRange 로직 옮기기

class NumberRange {
    constructor(min, max) {
        this._data = {min, max}
    }

    get min() {return this._data.min}
    get max() {return this._data.max}

    contains(arg) {return arg >= this.min && arg <= this.max}
}

const readingsOutsideRange = (station, range) => {
    return station.readings.filter(r => !range.contains(r.temp))
}